//表单验证和传输正确用户信息到数据库
function formCheck() {
    //获取本地的用户信息并且渲染到页面
    function get_username() {
        if (localStorage.getItem("tel")) {
            $(".login_registry").css({ display: "none" });
            let str = "<span>退出</span>";
            $(".showName").html("尊敬的" + localStorage.getItem("tel") + str);
        }
    }
    //渲染的结构 要使用事件委托
    $(".showName").on("click", "span", function() {
        localStorage.removeItem("tel");
        $(".login_registry").css({ display: "inline" });
        $(".showName").html("");
    });
    get_username();

    let spans = $('label span').not('#clac'); //所有提示信息框
    let form = $('.input_inof form'); //form
    let tel = $('#tel'); //电话号码框
    let check = $('#check'); //验证码框
    let clac = $('#clac'); //产生验证码信息
    let password = $('#password'); //获取密码框
    let repassword = $('#repassword'); //获取确认密码框
    let checkbox = $('#checkbox'); //ͬ获取 复选框
    let mystr = null; //记录产生的验证码
    let answer = null; //保存验证码的运算结果 方面做比对
    let flag = [false, false, false, false, false]; //保存各个输入框的状态
    spans.css({
        marginLeft: 8
    });


    //获取到焦点就消除提示信息
    tel.on('focus', function() {
        spans.eq(tel.index('input')).html("");
    });
    //失去焦点时候验证信息给出反馈提示
    tel.on('blur', function() {
        let reg = new RegExp(/^[1][3-9]\d{9}$/);
        if (reg.test(tel.val())) {
            //符合格式的手机号进行重名检测
            $.ajax({
                type: 'POST',
                url: 'http://10.31.157.19/myule/php/registry.php',
                data: {
                    tell: tel.val()
                }
            }).done(function(data) {
                if (data == 2) {
                    spans.eq(tel.index('input')).html("√").css({
                        color: 'green'
                    });
                    flag[tel.index('input')] = true;
                } else {
                    spans.eq(tel.index('input')).html("手机号已被注册").css({
                        color: 'red'
                    });
                    flag[tel.index('input')] = false;
                }
            });

        } else {
            //对于不符合格式
            if (tel.val()) {
                spans.eq(tel.index('input')).html("手机格式不符合").css({
                    color: 'red'
                });
            } else {
                spans.eq(tel.index('input')).html("手机号不能为空").css({
                    color: 'red'
                });
            }
            flag[tel.index('input')] = false;

        }
    });
    //聚焦时候消除提示
    tel.on('focus', function() {
        spans.eq(tel.index('input')).html("")
    });

    //验证码
    //产生随机验证码功能
    function createYzm() {
        let symbol = ['+', '*'];
        let num1 = Math.round(Math.random() * 10); //
        let num2 = Math.round(Math.random() * 10);
        let num3 = Math.round(Math.random() * 1); //
        mystr = num1 + " " + symbol[num3] + " " + num2;
        console.log(mystr);
        clac.html(mystr);
        switch (num3) {
            case 0:
                answer = num1 + num2;
                break;
            case 1:
                answer = num1 * num2;
                break;
        }
        console.log(answer);
    }
    createYzm(); //初始化验证码
    //点击触发验证码更新
    clac.on('click', function() {
        createYzm();
    });
    //失去焦点验证验证码信息
    check.on("blur", function() {
        if (answer == check.val()) { //验证码框结果和验证码运算结果相等
            spans.eq($(this).index()).html("√").css({
                color: 'green'
            });
            flag[check.index('input')] = true;
        } else {
            //验证码错误或者没输入
            if (check.val()) {
                spans.eq($(this).index()).html("验证码错误").css({
                    color: 'red'
                });
                $(this).val("");
                createYzm();
            } else {
                spans.eq($(this).index()).html("请输入验证码").css({
                    color: 'red'
                });
            }
            flag[check.index('input')] = false;
        }
    });
    //聚焦时候消除提示
    check.on('focus', function() {
        spans.eq(check.index('input')).html("");
    });

    //密码格式检测验证
    password.on("input", function() {
        spans.eq(password.index('input')).html("");
        let mystr = password.val();
        //检测密码复杂度
        if (password.val() && mystr.length >= 6 && mystr.length <= 16) {
            let reg = /\d/;
            let num = 0;
            if (reg.test(password.val())) {
                num++;
            }
            reg = /[a-z]/;
            if (reg.test(password.val())) {
                num++;
            }
            reg = /[A-Z]/;
            if (reg.test(password.val())) {
                num++;
            }
            reg = /[\W_]/;
            if (reg.test(password.val())) {
                num++;
            }
            switch (num) {
                case 1:
                    spans.eq(password.index('input')).html("弱").css({
                        color: 'red'
                    });
                    flag[password.index('input')] = false;
                    break;
                case 2:
                case 3:
                    spans.eq(password.index('input')).html("中").css({
                        color: 'blue'
                    });
                    flag[password.index('input')] = true;
                    break;
                case 4:
                    spans.eq(password.index('input')).html("高").css({
                        color: 'orange'
                    });
                    flag[password.index('input')] = true;
                    break;
            }
        }
        //密码过长
        if (mystr.length > 16) {
            spans.eq(password.index('input')).html("密码长度过长").css({
                color: 'red'
            });
            flag[password.index('input')] = false;
        }
    });

    //失去焦点时候验证密码复杂度和长度等情况给出提示
    password.on("blur", function() {
        if (!password.val()) {
            spans.eq(password.index('input')).html("密码不能为空").css({
                color: 'red'
            });
            flag[password.index('input')] = false;
        } else {
            if ("弱" == spans.eq(password.index('input')).html()) {
                alert("密码强度太弱会增加账号风险，注册将会失败，请提高密码复杂度(数字、字母大小写、特殊字符)");
            }
        }
        let mystr = password.val();
        if (mystr.length < 6) {
            spans.eq(password.index('input')).html("密码过短").css({
                color: 'red'
            });
            flag[password.index('input')] = false;
        } else if (mystr.length > 16) {
            spans.eq(password.index('input')).html("密码过长").css({
                color: 'red'
            });
            flag[password.index('input')] = false;
        }

        if (repassword.val()) { //防止密码在再修改后 确认密码的状态仍然停留在上一次
            if (password.val() !== repassword.val()) {
                spans.eq(repassword.index('input')).html("密码不一致").css({
                    color: 'red'
                });
                flag[repassword.index('input')] = false;
            }
        }

    });

    //聚焦时候消除提示
    repassword.on("focus", function() {
        spans.eq(repassword.index('input')).html("");
    });
    //确认密码失去焦点的时候判断和密码是否一致
    repassword.on("blur", function() {
        if (password.val() === repassword.val()) {
            flag[repassword.index('input')] = true;
            spans.eq(repassword.index('input')).html("√").css({
                color: 'green'
            });
        } else {
            spans.eq(repassword.index('input')).html("密码不一致").css({
                color: 'red'
            });
            flag[repassword.index('input')] = false;
        }
    });

    //提交表单时候 先验证是否勾选同意相关协议 再验证是否各个输入框状态都符合条件
    form.on("submit", function() {
        if (checkbox.prop("checked")) {
            flag[checkbox.index('input')] = true;
        } else {
            flag[checkbox.index('input')] = false;
            alert("请同意相关协议才能完成注册");
            return false;
        }
        for (let value of flag) {
            if (!value) {
                alert("用户信息不全");
                return false;
            }
        }
    });


}
formCheck();